<div (click)="_click($event)">
  <button type="button" class="lv-switch" [disabled]="lvDisabled" [ngClass]="{ 'lv-switch-on': checked, 'lv-switch-loading': lvLoading }">
    <span class="lv-switch-bg-on" *ngIf="checked" [ngSwitch]="true">
      <ng-container *ngSwitchCase="typeUtils.isTemplateRef(lvLabelOn)" [ngTemplateOutlet]="lvLabelOn"></ng-container>
      <ng-container *ngSwitchCase="typeUtils.isRealString(lvLabelOn)">{{ lvLabelOn }}</ng-container>
    </span>
    <span class="lv-switch-bg-off" *ngIf="!checked" [ngSwitch]="true">
      <ng-container *ngSwitchCase="typeUtils.isTemplateRef(lvLabelOff)" [ngTemplateOutlet]="lvLabelOff"></ng-container>
      <ng-container *ngSwitchCase="typeUtils.isRealString(lvLabelOff)">{{ lvLabelOff }}</ng-container>
    </span>

    <img *ngIf="lvLoading && checked" src="{{assetsPrefixPath}}assets/webp/blue.png" alt="icon-loading" class="lv-switch-loading-icon" />
    <img *ngIf="lvLoading && !checked" src="{{assetsPrefixPath}}assets/webp/gray.png" alt="icon-loading" class="lv-switch-loading-icon" />

    <span class="lv-switch-label-on" [ngSwitch]="true">
      <ng-container *ngSwitchCase="typeUtils.isTemplateRef(lvLabelOn)" [ngTemplateOutlet]="lvLabelOn"></ng-container>
      <ng-container *ngSwitchCase="typeUtils.isRealString(lvLabelOn)">{{ lvLabelOn }}</ng-container>
    </span>

    <span class="lv-switch-label-off" [ngSwitch]="true">
      <ng-container *ngSwitchCase="typeUtils.isTemplateRef(lvLabelOff)" [ngTemplateOutlet]="lvLabelOff"></ng-container>
      <ng-container *ngSwitchCase="typeUtils.isRealString(lvLabelOff)">{{ lvLabelOff }}</ng-container>
    </span>
  </button>
</div>
